﻿<%@ Page Theme="BlueSkin" Title="" Language="C#" MasterPageFile="~/LmsWebSite/MasterEN.master" AutoEventWireup="true" CodeFile="TestCut.aspx.cs" Inherits="TestCut" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
    
    
    
    
    <script type="text/javascript">
        var IE = document.all ? true : false;
        
        // If NS -- that is, !IE -- then set up for mouse capture
        if (!IE) document.captureEvents(Event.MOUSEMOVE);

            // Set-up to use getMouseXY function onMouseMove
            document.onmousemove = getMouseXY;

            // Temporary variables to hold mouse x-y pos.s
            var tempX = 0;
            var tempY = 0;

            var currentFormID = '<%# Page.Form.ClientID %>'


            var firstX = 0;
            var firstY = 0;

            var lastX = 0;
            var lastY = 0;

            var posLeft = 0;
            var posTop = 0;
            var posWidth = 0;
            var posHieght = 0;

            var hiddenTopID = '<%# hiddenTop.ClientID %>';
            var hiddenLeftID = '<%# hiddenLeft.ClientID %>';
            var hiddenWidthID = '<%# hiddenWidth.ClientID %>';
            var hiddenHeightID = '<%# hiddenHeight.ClientID %>';


            function calculateDivPosition() {

                if (firstX > lastX)
                    posWidth = firstX - lastX;
                else
                    posWidth = lastX - firstX;

                if (firstY > lastY)
                    posHieght = firstY - lastY;
                else
                    posHieght = lastY - firstY;


                if (firstX > lastX)
                    posLeft =  lastX;
                else
                    posLeft =  firstX;

                if (firstY > lastY)
                    posTop =  lastY;
                else
                    posTop =  firstY;             
                
                    
            }

   

            // Main function to retrieve mouse x-y pos.s

            function getMouseXY(e) {
                          
                if (IE) {
                var scrollLeft = 0;
                var scrollTop = 0;
              
                scrollLeft = document.documentElement.scrollLeft;
                scrollTop = document.documentElement.scrollTop;
              
              
               // grab the x-y pos.s if browser is IE
                 tempX = event.clientX + scrollLeft;
                 tempY = event.clientY + scrollTop;

                 

              } else {  // grab the x-y pos.s if browser is NS
              tempX = e.pageX;
              tempY = e.pageY;
              }  
              // catch possible negative values in NS4
              if (tempX < 0){tempX = 0;}
              if (tempY < 0){tempY = 0;}  
              
              return true
            }

        
    
    
        var bIsClicked = false;

        var divID = '<%# getID() %>';

        var left = 0;
        var top = 0;




        function calculatePos() {
            var dv = document.getElementById(divID);

           
            
             left =  dv.offsetLeft;
             top = dv.offsetTop;




            


            while (dv.offsetParent != null) {
                dv = dv.offsetParent;

                if (dv.offsetLeft != null && dv.offsetTop != null) {

                    

                    left = parseInt(dv.offsetLeft) + parseInt(left);

                    top = parseInt(dv.offsetTop) + parseInt(top);

                    
                }

            }


            //alert('left : ' + left.toString() + '   top : ' + top.toString());

            
        }


        function onMouseUp() {
            //alert(IE);
            bIsClicked = !bIsClicked;
            
            
            
            

            if (!bIsClicked) {
                //document.getElementById('dvDyn').style.display = 'none';
                onMouseMove();
                
                lastX = tempX;
                lastY = tempY;
                
                
                calculateDivPosition();
                posLeft = posLeft - left;
                posTop = posTop - top;


                document.getElementById(hiddenLeftID).value = posLeft;
                document.getElementById(hiddenTopID).value = posTop;
                document.getElementById(hiddenWidthID).value = posWidth;
                document.getElementById(hiddenHeightID).value = posHieght;
                //submit form

                //alert('Left : ' + posLeft + ' Top :  ' + posTop + ' Width :  ' + posWidth + ' Height :  ' + posHieght);

                document.getElementById(currentFormID).submit();
            }
            else {
                document.getElementById('dvDyn').style.display = 'inline';
                firstX = tempX;
                firstY = tempY;
                onMouseMove();
                
                
//                document.getElementById('dvDyn').style.left = tempX.toString() + 'px';
//                document.getElementById('dvDyn').style.top = tempY.toString() + 'px';
                
            }

            //alert(tempX.toString() + ' ' + tempY.toString());
        }


        function onMouseMove() {
            
                lastX = tempX;
                lastY = tempY;
                calculateDivPosition();
                if (bIsClicked) {
                document.getElementById('dvDyn').style.left = posLeft.toString() + 'px';
                document.getElementById('dvDyn').style.top = posTop.toString() + 'px';
                document.getElementById('dvDyn').style.width = posWidth.toString() + 'px';
                document.getElementById('dvDyn').style.height = posHieght.toString() + 'px';
            }
            
        
        }
        
        
    
    
    </script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">

<div id="dvDyn" style="width:100px;height:100px;border:solid 1px black;position:absolute;top:0px;left:0px;display:none;opacity:0.5;filter:alpha(opacity=50);background:red;" onmouseup ='javascript:onMouseUp();' onmousemove='javascript:onMouseMove();'>


</div>


    <table style="width: 100%;">
        <tr>
            <td>
                &nbsp;
            </td>
            <td>
                &nbsp;
            </td>
            <td>
                &nbsp;
            </td>
        </tr>
        <tr>
            <td>
                &nbsp;
            </td>
            <td>
                &nbsp;
            </td>
            <td>
                &nbsp;
            </td>
        </tr>
        <tr>
            <td>
                &nbsp;
            </td>
            <td>
                &nbsp;
            </td>
            <td>
                &nbsp;
            </td>
        </tr>
        
    </table>
    
    
    <table style="width: 100%;">
        <tr>
            <td>
                &nbsp;
            </td>
            <td>
                &nbsp;
            </td>
            <td>
                &nbsp;
            </td>
        </tr>
        <tr>
            <td>
                &nbsp;
            </td>
            <td>
                &nbsp;
            </td>
            <td>
                &nbsp;
            </td>
        </tr>
        <tr>
            <td>
                &nbsp;
            </td>
            <td>
                <asp:HiddenField ID="hiddenTop" runat="server" Value="0"/>
                <asp:HiddenField ID="hiddenLeft" runat="server" Value="0"/>
                <asp:HiddenField ID="hiddenWidth" runat="server" Value="0"/>
                <asp:HiddenField ID="hiddenHeight" runat="server" Value="0"/>
            </td>
            <td>
                <div runat="server" id="testDiv" style="width:500px;height:750px;background:inherit;left:inherit;top:inherit;border:solid 1px black;" onmouseup ='javascript:onMouseUp();' onmousemove='javascript:onMouseMove();'></div>
                
                <asp:Image ID="imgCut" Width="500px" Height="750px" runat="server" style="border:solid 1px black;" />
            
            </td>
        </tr>
        
            
        
    </table>
    
    
    
    
    
</asp:Content>

